/*
 * @author zei, QQ:77132995, email:kazeik@163.com
 * 2021/12/8 17:17
 * 类说明:
 */

import 'package:flutter/material.dart';
import 'package:flutter_app/CorpImageWidget.dart';
import 'package:image_scan_crop/utils/Utils.dart';
import 'package:photo_view/photo_view.dart';

class AnyRangleCropPage extends StatefulWidget {
  const AnyRangleCropPage({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _AnyRangleCropPage();
}

class _AnyRangleCropPage extends State<AnyRangleCropPage> {
  final GlobalKey _cropKey = GlobalKey();

  @override
  Widget build(BuildContext context) {
    // return RepaintBoundary(
    //   key: _cropKey,
    //   child: Container(
    //     color: Colors.red,
    //     width: 100,
    //     height: 100,
    //     child: CropImageWidget(),
    //   ),
    // );
    return Scaffold(
      appBar: AppBar(
        title: const Text("任意角度截剪"),
        actions: [
          GestureDetector(
            child: const Padding(
              padding: EdgeInsets.only(right: 10),
              child: Icon(
                Icons.check,
                color: Colors.white,
              ),
            ),
            onTap: () {},
          )
        ],
      ),
      body: Stack(
        textDirection: TextDirection.ltr,
        fit: StackFit.expand,
        alignment: AlignmentDirectional.center,
        children: <Widget>[
          PhotoView.customChild(
            child: Container(
              margin: const EdgeInsets.only(left: 10, top: 10),
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage(
                    Utils.getImgPath("ts", format: "jpg"),
                  ),
                ),
              ),
              child: Stack(
                children: [
                  Stack(children: [
                    Positioned(
                      top: 30,
                      left: 100,
                      child: Container(
                        width: 100,
                        height: 30,
                        decoration: BoxDecoration(
                          border: Border.all(color: Colors.red),
                        ),
                        alignment: Alignment.center,
                        child: const Icon(
                          Icons.add_circle_outline,
                          color: Colors.white,
                        ),
                      ),
                    ),
                    Positioned(
                      top: 150,
                      left: 100,
                      child: Container(
                        width: 80,
                        height: 30,
                        decoration: BoxDecoration(
                          border: Border.all(color: Colors.yellow),
                        ),
                        alignment: Alignment.center,
                        child: const Icon(
                          Icons.add_circle_outline,
                          color: Colors.white,
                        ),
                      ),
                    ),
                    Positioned(
                      top: 70,
                      left: 20,
                      child: GestureDetector(
                        child: Container(
                          width: 140,
                          height: 30,
                          decoration: BoxDecoration(
                            border: Border.all(color: Colors.green),
                          ),
                          alignment: Alignment.center,
                          child: const Icon(
                            Icons.add_circle_outline,
                            color: Colors.white,
                          ),
                        ),
                        onTap: () {
                          Utils.showToast("msg");
                        },
                        onPanUpdate: (detail) {
                          Offset localPosition = Offset(detail.localPosition.dx,
                              detail.localPosition.dy); // 转换为局部坐标但实际是全局坐标
                          Offset globalPosition = Offset(
                              detail.globalPosition.dx,
                              detail.globalPosition.dy); // 获得的是全局坐标。
                          Utils.logs(
                              "local : ${localPosition.dx} - ${localPosition.dy} | global = ${globalPosition.dx} - ${globalPosition.dy}");
                        },
                      ),
                    ),
                  ])
                ],
              ),
            ),
          ),
          RepaintBoundary(
            key: _cropKey,
            child: Container(
              margin: EdgeInsets.all(100),
              color: Colors.white,
              width: 100,
              height: 100,
              child: CropImageWidget(),
            ),
          ),

          // CropWidget(
          // controller: _cropController,
          // ),
        ],
      ),
    );
  }
}
